<?php
//引入全局配置（和引入函数库类似）
include_once("config/config.php");

$admin = LoginCheck();

// 提交表单，处理并保存数据到后台
if ($_POST) {
  // 接收表单提交的参数
  $username = isset($_POST["name"]) ? trim($_POST["name"]) : "";
  $password = isset($_POST["password"]) ? trim($_POST["password"]) : "";
  $confirm = isset($_POST["confirm"]) ? trim($_POST["confirm"]) : "";
  $file = isset($_FILES["avatar"]) ? $_FILES["avatar"] : "";
  //接收保存图片方法的返回值，是个数组
  $avatarResult = build_upload('avatar');

  // 验证表单数据
  if (empty($username)) {
    notice("用户名不能为空");
  };
  if (empty($password)) {
    notice("密码不能为空");
  };
  if (empty($confirm)) {
    notice("确认密码不能为空");
  };
  if ($password != $confirm) {
    notice("密码与确认密码不一致");
  };
  if (empty($avatarResult)) {
    notice("请选择图片");
  };


  // 密码盐,由于放上面会影响密码和确认密码的验证因此放到这个位置
  $salt = build_randstr();
  $password = md5($password . $salt);

  // 验证图片是否上传成功
  if ($avatarResult["code"] === 0) {
    notice($avatarResult["msg"]);
  };

  // 插入数据到后台数据库
  // 先封装要插入的数据
  $adminData = [
    "username" => $username,
    "password" => $password,
    "salt" => $salt,
    "avatar" => $avatarResult["data"],
  ];

  $result = add("admin", $adminData);

  if ($result) {
    notice("添加成功", "adminList.php");
  }
  notice("添加失败");
}







?>

<!DOCTYPE html>
<html lang="en">

<head>
  <!-- 引入meta设置 -->
  <?php include_once("./common/meta.php") ?>
</head>

<style>
  #upload {
    width: 200px;
    height: 200px;
    object-fit: cover;
    margin-bottom: 15px
  }
</style>

<body>
  <!-- 引入header -->
  <?php include_once("./common/header.php") ?>

  <!-- 引入menu -->
  <?php include_once("./common/menu.php") ?>


  <div class="content">

    <div class="header">
      <h1 class="page-title">添加管理员</h1>
    </div>

    <ul class="breadcrumb">
      <li><a href="index.html">Home</a> <span class="divider">/</span></li>
      <li class="active">articleAdd</li>
    </ul>

    <!-- 内容 -->
    <div class="container-fluid">
      <div class="row-fluid">

        <div class="btn-toolbar">
          <button class="btn btn-primary" onClick="location='articleList.php'"><i class="icon-list"></i> 管理员列表</button>
          <div class="btn-group">
          </div>
        </div>

        <div class="well">
          <div id="myTabContent" class="tab-content">
            <div class="tab-pane active in" id="home">
              <form id="form" method="post" enctype="multipart/form-data" onsubmit="submit()">
                <label>用户名</label>
                <input type="text" id="name" name="name" placeholder="请输入用户名" class=" input-xxlarge">
                <label>密码</label>
                <input type="password" id="password" name="password" placeholder="请输入密码" class="input-xxlarge"></input>
                <label>确认密码</label>
                <input type="password" id="confirm" name="confirm" placeholder="请确认密码" class=" input-xxlarge">
                <label>头像</label>
                <input type="file" id="avatarid" name="avatar" hidden class="input-xxlarge">
                <img src="./assets/images/170x170.gif" id="upload" onClick="avatar.click();"><br>
                <!-- 图片点击事件为触发avatar的点击事件 -->
                <input class="btn btn-primary" type="submit" value="提交" />

              </form>
            </div>
          </div>
        </div>

        <div class="modal small hide fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
          aria-hidden="true">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
            <h3 id="myModalLabel">Delete Confirmation</h3>
          </div>
          <div class="modal-body">

            <p class="error-text"><i class="icon-warning-sign modal-icon"></i>Are you sure you want to delete the user?
            </p>
          </div>
          <div class="modal-footer">
            <button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
            <button class="btn btn-danger" data-dismiss="modal">Delete</button>
          </div>
        </div>

      </div>
    </div>
  </div>
</body>

</html>

<!-- 显示图片 -->
<script>
  //监听头像，展示头像文件
  $("#avatarid").change(function() {

    let file = $(this)[0].files[0];

    // 验证文件
    if (file) {
      // 初始化一个本地文件读取器
      let Reader = new FileReader();

      //将file对象转成base64编码，二进制文件流。读取完成会自动触发loadend事件。
      Reader.readAsDataURL(file);

      //自定义loadend事件，读取文件
      Reader.onload = function() {
        // 该对象的Reader.result保存了base64编码
        $("#upload").attr("src", Reader.result)

        return false;
      };
    }

  });
</script>